﻿@{
    ViewBag.Title = "课程管理";
    Layout = "~/Views/Shared/_AdminLayout.cshtml";
    List<LeEdu.Entity.Course> courses = ViewBag.Courses as List<LeEdu.Entity.Course>;
}

@section Header
{
    <link href="~/assets/font-awesome-4.6.3/css/font-awesome.min.css" rel="stylesheet" />
    <link href="~/assets/plupload/jquery.plupload.queue/css/jquery.plupload.queue.css" rel="stylesheet" />
    <script src="~/assets/plupload/plupload.full.min.js"></script>
    <script src="~/assets/plupload/jquery.plupload.queue/jquery.plupload.queue.min.js"></script>
    <script src="~/assets/plupload/i18n/zh_CN.js"></script>
    <script src="~/assets/esimakin-twbs-pagination/jquery.twbsPagination.min.js"></script>
}

@*<div class="col-md-2">
    <div class="list-group">
        <a href="@Url.Action("Course", "Admin")" class="list-group-item active">课程管理</a>
    </div>
</div>*@

<div class="col-md-12">
    <div class="page-header clearfix">
        <h4 class="pull-left">课程列表</h4>
        <!--操作按钮-->
        <div class="pull-right">
            <a class="btn btn-success btn-sm" data-toggle="modal" data-target="#modal_add_course">添加课程</a>
        </div>
    </div>

    <!--内容区域-->
    <form id="user-search-form" class="form-inline well well-sm" action="/Exam/QueryExam" method="post" novalidate="">
        <div class="form-group">
            <input type="text" id="keyword" name="ExamName" class="form-control" value="" placeholder="添加相关词">
        </div>
        <button class="btn btn-primary" type="submit">搜索</button>
    </form>

    <table id="user-table" class="table table-striped table-hover" data-search-form="#user-search-form">
        <thead>
            <tr>
                <th>序号</th>                 
                <th>课程名称</th>
                <th>简介</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
            @for (int i = 0; i < courses.Count; i++)
            {
                var index = (ViewBag.PageIndex - 1) * ViewBag.PageSize + i + 1;
                    
                <tr id="user-table-tr-6">
                <td style="width:10%;">
                    <strong>
                        @index
                    </strong>
                </td>
                
                <td style="width:30%">
                    @courses[i].Name
                </td>
                <td style="width:50%">
                   @courses[i].Description
                </td>

                <td style="width:10%;">
                    <div class="btn-group">
                        <a href="@Url.Action("Course", "Admin", new { cid=courses[i].Id})" class="btn btn-default btn-sm">管理</a>
                        <a href="#" type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                            <span class="caret"></span>
                        </a>
                        <ul class="dropdown-menu">
                            <li><a data-toggle="modal" data-target="#modal_edit_course" id="LoadCourse" href="#" data-id="@courses[i].Id" >编辑</a></li>
                            <li><a href="@Url.Action("DelCourse", "Admin", new { cid=courses[i].Id})" onclick="return confirm('确定要删除吗？')">删除</a></li>
                            
                    </div>
                </td>
                </tr>
              }
        </tbody>
    </table>

    <!--分页-->
        <nav class=" text-center">
            <ul id="pagination" class="pagination-sm"></ul>
        </nav>
</div>

<!--添加课程模态框-->
<div class="modal fade" id="modal_add_course" tabindex="-1" role="dialog" aria-labelledby="label_course">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="label_course"><strong>添加课程</strong></h4>
            </div>
            <div class="modal-body">
                <div class="row form-group">
                    <div class="col-md-2 control-label">
                        <label for="email">课程名称</label>
                    </div>
                    <div class="col-md-7 controls">
                        <input id="name" class="form-control" type="text">
                    </div>
                </div>
                <div class="row form-group">
                    <div class="col-md-2 control-label">
                        <label for="nickname">课程描述</label>
                    </div>
                    <div class="col-md-7 controls">
                        <textarea id="des" class="form-control"></textarea>
                    </div>
                </div>
                
            </div>
            <div class="modal-footer">
                <div id="doing" style="float:left;display:none;">
                    <i class="fa fa-circle-o-notch fa-spin"></i><span> 处理中...</span>
                </div>
                <div id="success" style="float: left; display: none; ">
                    <i class="fa fa-check-square"></i><span> 保存成功！</span>
                </div>
                <div id="error" style="float: left; display: none; ">
                    <i class="fa fa-warning"></i><span> 保存失败！</span>
                </div>

                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button id="btn_add_course" type="button" class="btn btn-primary">提交</button>
            </div>
        </div>
    </div>
</div>

<!--编辑课程模态框-->
<div class="modal fade" id="modal_edit_course" tabindex="-1" role="dialog" aria-labelledby="label_course">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="label_course"><strong>编辑课程</strong></h4>
            </div>
            <div class="modal-body">
                <div class="row form-group">
                    <div class="col-md-2 control-label">
                        <label for="email">课程名称</label>
                    </div>
                    <div class="col-md-7 controls">
                        <input id="edit_cid" type="hidden" />
                        <input id="edit_name" class="form-control" type="text">
                    </div>
                </div>
                <div class="row form-group">
                    <div class="col-md-2 control-label">
                        <label for="nickname">课程描述</label>
                    </div>
                    <div class="col-md-7 controls">
                        <textarea id="edit_des" class="form-control"></textarea>
                    </div>
                </div>

            </div>
            <div class="modal-footer">
                <div id="doing" style="float:left;display:none;">
                    <i class="fa fa-circle-o-notch fa-spin"></i><span> 处理中...</span>
                </div>
                <div id="success" style="float: left; display: none; ">
                    <i class="fa fa-check-square"></i><span> 保存成功！</span>
                </div>
                <div id="error" style="float: left; display: none; ">
                    <i class="fa fa-warning"></i><span> 保存失败！</span>
                </div>

                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button id="btn_edit_course" type="button" class="btn btn-primary">提交</button>
            </div>
        </div>
    </div>
</div>

 

@section Footer{
    <script type="text/javascript">        
        $(function () {   
            //添加课程模态框
            $("#btn_add_course").click(function () {
                var name = $("#name").val();
                var des = $("#des").val();  
                $.ajax({
                    url: '@Url.Action("AddCourse", "Admin")',
                    type: "post",
                    data: { name: name, des: des },
                    success: function (data) {
                        if (data.Code = 1) {
                            $("#doing").hide();
                            $("#success").show();
                            setTimeout(function () {
                                $("#modal_add_course").modal('hide');
                                window.location.href = '@Url.Action("CourseManager","Admin")';
                            }, 1000);

                        }
                        else {
                            $("#doing").hide();
                            $("#error").show();
                        }
                    },
                    beforeSend: function (xhr) {
                        $("#name").attr({ "disabled": "disabled" });
                        $("#des").attr({ "disabled": "disabled" });
                        $("#btn_add_course").attr({ "disabled": "disabled" });
                        $("#doing").show();
                    },
                    complete: function (xhr, status) {
                        $("#doing").hide();
                    }
                });
            });

             

            $('#modal_add_course').on('hidden.bs.modal', function (e) {
                $("#name").removeAttr("disabled");
                $("#des").removeAttr("disabled");
                $("#btn_add_course").removeAttr("disabled");

                $("#doing").hide();
                $("#success").hide();
                $("#error").hide();
                $("#name").val("");
                $("#des").val("");
            });





            //编辑课程模态框

            $("#btn_edit_course").click(function () {
                var name = $("#edit_name").val();
                var des = $("#edit_des").val();
                var cid = $("#edit_cid").val();


                $.ajax({
                    url: '@Url.Action("EditCourse", "Admin")',
                    type: "post",
                    data: { name: name, des: des ,cid:cid},
                    success: function (data) {
                        if (data.Code = 1) {
                            $("#doing").hide();
                            $("#success").show();
                            setTimeout(function () {
                                $("#modal_edit_course").modal('hide');
                                window.location.href = '@Url.Action("CourseManager","Admin")';
                            }, 1000);

                        }
                        else {
                            $("#doing").hide();
                            $("#error").show();
                        }
                    },
                    beforeSend: function (xhr) {
                        $("#edit_name").attr({ "disabled": "disabled" });
                        $("#edit_des").attr({ "disabled": "disabled" });
                        $("#btn_edit_course").attr({ "disabled": "disabled" });
                        $("#doing").show();
                    },
                    complete: function (xhr, status) {
                        $("#doing").hide();
                    }
                });
            });


            $("#LoadCourse").click(function () {
                var cid = $("#LoadCourse").attr("data-id");
                $.ajax({
                    url: '@Url.Action("GetCourseById", "Admin")',
                    type: "post",
                    data: { cid: cid },
                    success: function (data) {

                        $("#edit_name").val(data.Name);
                        $("#edit_des").val(data.Description);
                        $("#edit_cid").val(data.Id);
                    },
                });
            
            })
                

          






            $('#modal_edit_course').on('hidden.bs.modal', function (e) {



                $("#edit_name").removeAttr("disabled");
                $("#edit_des").removeAttr("disabled");
                $("#btn_edit_course").removeAttr("disabled");

                $("#doing").hide();
                $("#success").hide();
                $("#error").hide();
                $("#edit_name").val("");
                $("#edit_des").val("");
            });







            //分页

            $('#pagination').twbsPagination({
                totalPages: '@ViewBag.TotalPage',
                visiblePages: 5,
                first: "首页",
                prev: "上一页",
                next: "下一页",
                last: "尾页",
                href: '/Admin/CourseManager?pageIndex={{pageNumber}}',
                hrefVariable: '{{pageNumber}}',
                onPageClick: function (event, page) {
                    $('#page-content').text('Page ' + page);
                }
            });

            

        });
    </script>


 
}